<template>
  <div>
    <div class="home" style="display: flex;justify-content: center;align-items: center;">
      <div style="width: 80%">
        <a-row>
          <a-col :span="8" style="text-align: center;border-right: 1px solid #c8c7c7;">
            <img src="../../static/config.png" class="module_margin home_icon" alt=""/>
            <div style="font-weight: bold;">测试日报跟踪</div>
            <div class="module_margin">方便历史追踪</div>
          </a-col>
          <a-col :span="8" style="text-align: center;border-right: 1px solid #c8c7c7;">
            <img src="../../static/clock.png" class="module_margin home_icon" alt=""/>
            <div style="font-weight: bold;">测试报告跟踪</div>
            <div class="module_margin">汇总各版本测试报告</div>
          </a-col>
          <a-col :span="8" style="text-align: center;">
            <img src="../../static/MixIcon.png" class="module_margin home_icon" alt=""/>
            <div style="font-weight: bold;">工具化，数据化</div>
            <div class="module_margin">可通过平台自动触发送邮箱，发送企业微信群机器人消息</div>
          </a-col>
        </a-row>
      </div>
    </div>
  </div>
</template>

<script>
  /* eslint-disable */

  import bgImg from "@/static/Background.png"
import bgImg2 from "@/static/Background2.png"

export default {
  name: "",
  data() {
    return {
      searchList: [],
      global_search_state: false,
      placeholder: "聚焦搜索",
      json: {
        "hello": "vue"
      },
      options: {mode: 'code'},
      code: "",
      oldStr: "",
      newStr: "",
      bgImg: bgImg,
      bgImg2: bgImg2,
    }
  },
  methods: {
    showSearch() {
      this.$refs.search_child.showSearchModal()
      this.global_search_state = !this.global_search_state
      this.searchList = []
    },
    search(val) {
      console.log(val)
    },
    hideSearch() {
      this.global_search_state = false
    },
    goToApi() {
      this.$router.push({
        path: "/interfaceList"
      })
    },
    goToPlan() {
      this.$router.push({
        path: "/plan"
      })
    }
  }
}
</script>

<style scoped>
.home {
  width: 100%;
  height: calc(100vh + 50px);
  zoom: 100%;
  position: relative;
  text-align: center;
  padding: 0;
  background-size: 100% 100%
}

.home_button {
  position: absolute;
  bottom: 300px;
  width: 200px;
  height: 60px;
  line-height: 60px;
  border-radius: 30px;
  left: 50%;
  margin-left: -100px;
  font-size: 18px;
  cursor: pointer;
  color: #fff;
  background: orangered
}
.plan_button{
  position: absolute;
  left: 20%;
  top: 60%;
  width: 200px;
  height: 40px;
  line-height: 40px;
  color: #fff;
  background: #1890ff;
  font-size: 16px;
  cursor: pointer;
  border-radius: 20px;

}
.module_margin {
  margin: 36px 0;
}
.home_icon{
  width: 90px;
  height: 90px;
}
</style>
